// 7月8号------------------7月8号----------------
// 注意删除项目默认的代码后,需要重新定义最下面的state,mutations,actions(不然就报错不能运行项目)

// 思路:用vuex去存token其实就是提供对应的字段,以及暴露对应的方法,(把用户的登陆接口抽到vuex保存即可)
// 注意,mutations也可以使用异步操作,但是在控制台的vue插件里面捕获不到数据的便更,所以为了统一,
// 就需要放到actions里面,目的是为了插件可以方便调试
// 需求:1,在`store/modules/user.js`模块中封装登录的`actions`
// 2,登录成功之后更新`vuex仓库`和`本地`的`token`(因为token在刷新页面是还存在的,所以不仅要在vuex仓库需要存,本地也需要存)
// 存本地用,localStorage
// 目前这个项目的本地,token是保存在 Cookies里面的  utils/auth.js里面
// 3,页面中使用`actions`来执行登录操作(比如目前的login页面这里方法定义完成后,可以使用mapActions辅助函数进行登陆)
// -------------------------------------------
// 导入utils/auth.js 保存token的工具函数
import { setToken, getToken, removeToken } from '@/utils/auth.js'
// 导入登陆接口api/user.js  7月9号导入getInfo,获取用户信息的接口
import { login, getInfo, logout, getMoreInfo } from '../../api/user.js'
// state,定义数据的
const state = () => {
  return {
    // 7月8号修改 -------------7月8号修改----------
    // token(用来存储token的,默认为空)
    // token: undefined
    // 7月9号修改 -------------7月9号修改----------
    // getToken()这里获取token的目的是,项目启动之后,从cookie中读取token并赋值
    // 这是 一个函数需要加括号
    token: getToken(),
    // 7月9号修改 -------------7月9号修改----------
    // 用户信息 (默认空对象,这样就算点里面不存在的属性,也不会报错),但是如果这里写一个undefined,就会报错,因为undefined不能点东西
    userInfo: {}
  }
}
// mutations,(是用来修改token的)
const mutations = {
  setToken(state, newToken) {
    state.token = newToken
  },
  // 7月9号修改 -------------7月9号修改----------
  // 修改userInfo
  setUserInfo(state, newUserInfo) {
    state.userInfo = newUserInfo
  }
}
// actions
const actions = {
  // actionsLogin是 actions里面定义的方法
  async actionsLogin(context, data) {
    // 抽取异步,登陆的异步操作就是一个接口的调用,当抽取到接口调用后,传递的参数就需要传进来(data)
    // 第一先导入登陆接口
    // login是调用登陆接口用的api/user.js里面的
    // 拿到服务器返回的token,然后保存起来
    const token2 = await login(data)
    // 拿到token后存本地
    setToken(token2)
    // 存vuex里面
    context.commit('setToken', token2)
  },
  // 7月9号修改 -------------7月9号修改----------
  //  token在请求拦截器里面已经带了,所以这里不需要带参数了
  async getUserInfo(context) {
    const res = await getInfo()
    console.log('res', res)
    // 7月10号修改 ----增加---------7月10号修改----------
    // 调用接口,获取用户信息(头像),包括id
    const moreRes = await getMoreInfo({ id: res.userId })
    console.log('moreRes', moreRes)
    // 保存数据(注意这里的res不需要再点了,因为展开了)(在utils/request.js的const { success, data, message } = response.data)
    // 7月10号修改 ----增加---------7月10号修改----------
    // 注意,两个数据的合并在一起设置给用户信息userInfo { ...res, ...moreRes },必须用对象,不能是[ ...res, ...moreRes]
    // 因为userInfo: {} 给的就是一个对象
    context.commit('setUserInfo', { ...res, ...moreRes })
  },
  // 7月10号修改 -------------7月10号修改----------月10号修改----------
  // src\layout\components\Navbar.vue页面使用了这里的退出逻辑
  // 退出登陆的操作(用户点击退出需要的逻辑)
  async logout(context) {
    // 删除本地的token
    removeToken()
    // 删除vuex里面的token(为什么给undefined,因为最总解释完后是一个false)
    context.commit('setToken', undefined)
    // 删除用户的信息
    context.commit('setUserInfo', {})
    // 7月23号修改 -------------7月23号修改----------月23号修改----------------------------------
    // 分析:::当前的bug就是, 其他用户继续登录后,能访问管理器的页面,比如权限管理页面,为什么会这样???
    // 是因为没有把管理员加进去的规则删除,所以当前的问题就是,原本退出登陆是没有问题的,但是现在是牵扯到一个addRoutes动态路由加载
    // 所以在退出的时候,不仅仅需要删除用户信息,还需要删除动态路由添加的规则,
    // 111,清空路由,src\router\index.js最下面定义的方法,
    // resetRouter()
    // 222,修改permission.js,面保存的 allRoutes也需要删除,
    // 但是删除allRoutes这个数据就有点麻烦了,因为当前模块,是在src\store\modules\user.js
    // 然后,permission.js 和user.js是平级的,,所以在user.js这个模块里面去删除permission.js模块里面的数据,(需要删除的是这个 allRoutes)
    // 就需要用到vuex官网定义的方法>>>使用vuex modules 里面定义的方法,若需要在全局命名空间内分发 action 或提交 mutation，将 { root: true } 作为第三参数传给 dispatch 或 commit 即可。
    // 重新给permission.js里面的setRoutes重新传递一个空值就行 [],然后,{ root: true }
    // context.commit('permission/setRoutes', [], { root: true })
  }
}

export default {
  // 开启命名空间
  namespaced: true,
  // 下面是简写的语法,和mutations: {},效果一样
  state,
  mutations,
  actions
}
